<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <p id="myclock" style="font-size: 24px"></p>
    <button id="start">开始</button>
    <button id="end">停止</button>


    <script>
        var myclock = document.getElementById('myclock');
        var start = document.getElementById('start');
        var end = document.getElementById('end');
        var mytimer = setInterval(callback,1000);
        function callback(){
            var mydate = new Date();
            myclock.innerHTML = mydate.getHours() + ":"
                +mydate.getMinutes() + ":"
                +mydate.getSeconds() ;
        }

        start.onclick = function (){
            if(mytimer == null) {
                mytimer = setInterval(callback, 1000)
            }
        }

        end.onclick = function () {
            clearInterval(mytimer)
            mytimer = null;
        }
    </script>
</body>
</html>